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T INTRODUCTION 


А. AREA OF RESEARCH 

The World Wide Web is causing a major change education. 
There has been a rapid increase in the number of people 
using the Web, and this has created significant potential 
for university teaching. There is now the prospect of 
"distributed learning" with students at perhaps many 
different remote sites. It has created a new paradigm for 
teaching and learning different from the traditional 
classroom experience. 

The Department of Electrical and Computer Engineering 
(ECE) at the Naval Postgraduate School (NPS) has initiated a 


Distributed Learning program intended to achieve two goals: 


e extend the benefits of a militarily-relevant 
electrical and computer engineering education to 
more people. 


e enhance existing on-site courses by introducing 
multimedia into the learning process. 


The ECE department oversees the Navy's graduate program 
of education in signals, Сааса e networking, 
communications, power systems and computing. Rapid changes 
in technology have made education for electrical and 
computer engineers even more important than in the past. At 


the same time, job demands have made it difficult for people 


Бо devote the time needed to improve their effectiveness. 
Distributed learning is seen as а cost/time-effective 
solution to this problem. 

The first goal of extending education to more people 
includes both new students in the form of short courses, as 
well as a full Master of Science or Doctor of Philosophy 
program, and former students in the form of continuing 
education. The second goal relates to improving the way 
students learn. The multimedia capabilities of the Web allow 
the use of color, graphics, animation and interaction, in 
ways that have not been possible in the past. 

The goal of this thesis is to develop a prototype web- 
based course, specifically, EC2820 - Digital Logic Design, 
which shall include self-paced lectures, quizzes, laboratory 
Ie Soano criteria Pee al notes, and so tortas 
primary sub-goal is to quantify time required to develop a 
web-based course and to understand the tradeoffs involved. A 


secondary sub-goal is to evaluate web development tools. 


B. RESEARCH QUESTIONS 


e Which recent Web technology is the most suitable 
(e.g. cost/time-effective) for the production of Web- 
Based Training (WBT) ECE courses? 


e What is the recommended approach, design and 
development process that should be adopted for 
future productions? 


e What training is required of individuals who do such 
production? 


er RESULTS OF THE RESEARCH 

This research has established a step-by-step design and 
development process for WBT course prođuction, which have 
been adopted to successfully complete the EC2820 - Digital 
Logic Design On-Line Course, and the EC2820 Homepage from 
which the on-line course is launched. This research has also 
determined the Web technology suitable for future WBT course 
production efforts by the ECE department. 

Chapter II discusses the benefits of Distributed 
Learning. It also covers the approach and the resources 
required to undertake a WBT course production. In addition, 
it addresses the principal considerations that need to be 
examined when selecting a course for WBT. 

Chapter III, Recent Technologies For WBT Course 
Production, presents the research findings on several Web 
technologies, currently used to produce WBT courses. The 
pros and cons of each type were examined and compared. 

Chapter IV explains the step-by-step design and 
development process of producing the EC2820 Homepage and the 
EC2820 - Digital Logic Design On-Line Course. It also covers 


the use of a popular software development approach known as 


"incremental development" that was specifically used to 
design and develop the on-line course. 


Chapter V contains the conclusions and recommendations. 


II. DISTRIBUTED LEARNING 


A. WHAT IS DISTRIBUTED LEARNING? 

Distributed learning allows students from anywhere in 
the world to study at home or work. The means of delivery of 
the educational materials include satellite broadcast, 
broadband broadcast, home video, two-way compressed video, 
audio conferencing, text-based correspondence courses, 
television broadcast, and the Web. 

New and exciting distributed learning methodology with 
extensive use of multimedia, using the Web to provide Web- 
based Training (WBT) courses, is rapidly being developed, 
making the Web currently the most  cost/time-effective 
option. Also, the Web is easily accessible by users using 
computers connected to the internet from a location of their 
choice, and more importantly at their own pace and in their 
own time. Appendix A discusses important principles in the 


use of multimedia for distributed learning. 


B. WHY DISTRIBUTED LEARNING? 
Many organizations have gone into distributed learning 


for the following reasons: 


e To extend education to more people. 


e To augment present traditional education. 


e To provide education, tailored to specific needs. 
e To improve costs and efficiencies by distributing 


instructional components inexpensively to physically 
remote locations. 


C. RESOURCES & TIME REQUIRED FOR WBT COURSE 
PRODUCTION 


In order to produce an effective WBT course, a design 
and development team consisting of the following members has 


to be formed: 


1 Content Expert 

The content expert is usually. the instructor or the 
producer of the course materials used for the traditional 
teaching method. He/she is usually the team leader and is 
the one to decide what materials to include in the WBT 


course, 


2 - Web Designer 

The Web designer is responsible to transform the course 
materials from their raw form (hand-written or type-written) 
into a digital form suitable for interactive presentations 
using multimedia software tools. He/she will determine how 
interactivity can be used to encourage active involvement 
from the users, and how animations can be used to illustrate 


difficult concepts and complex processes. 


3% Education Specialist 
The education specialist is responsible for the 
organization and presentation of the WBT course materials to 


ensure that they become the effective learning tools. 


4. Graphic Designer / Artist 

The graphic designer is responsible to transform 
figures, tables, and photos in their raw form (hand-drawn, 
computer-drawn or any analog type) into computer graphics 
suitably compressed to reduce their size to allow fast 
downloading time of the WBT course into the user's 
computers. He/she will also be responsible for implementing 


any animations required. 


Ба Programmer 
In WBT course production, where there is programming 
involved, a programmer is required. He/she is responsible to 


code, test, interface and integrate all the WBT components. 


6. Server Administrator 
The server administrator is responsible for providing a 
website for publishing the WBT course, and protecting its 


contents from unauthorized access and modification. 
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III. RECENT TECHNOLOGIES FOR WBT COURSE PRODUCTION 


In evaluating a suitable technology for WBT course 


production, the following characteristics were preferred: 


were 


Uses Commercial-Off-the-Shelf (COTS) software. 
Has short development time 

Encourages interactivity. 

Has good maintenance/upgrade support 


Ше сое СЕ ее 


Several recent technologies used to develop WBT courses 


studied. They include the following: 


Lecture materials published on web pages. 


Slide shows, similar to those produced by Microsoft 
Powerpoint, that run on the web browser. 


An interactive course developed using a high level 
language such as Java or Visual Basic. 


An interactive course developed using a proprietary 
software package. 


An interactive course developed using commercial- 
off-the-shelf (COTS) authoring tools such as the 
Macromedia Director 7, Macromedia Authorware 5 and 
Asymetrix Toolbook. 


LECTURE MATERIALS PUBLISHED ON WEB PAGES 


Publishing lecture materials directly on web pages is 


the simplest, the easiest and the fastest to produce WBT 


courses. Essentially, the lecture materials are digitized 
with text  type-written, tables created using a  word- 
processing application, and figures scanned or drawn with a 
graphics-editing program. 


A sample is shown Figure 1 below. 
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Memory elements store state. Logic blocks that contain a memory element contain 
state and are sequential. 


Simplest type of memory element is an unclocked latch - i.e. without a clock input. 


Unclocked latch 


S-R (set-reset) latch constructed from a pair of cross-coupled NOR gates. [Diagram given in lecture] 
Asserting S and R simultaneously can lead to incorrect operation. The cross-coupling is the basis for 
more complex memory elements that allow us to store data signals. Such elements contain additional 
gates used to store signal values and to cause the state to be updated only in conjunction with a 
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Figure 1. Example Of Lecture Materials Published On 
A Web Page 


The main disadvantage of this form of WBT course is 
that it lacks the two elements, animation and interactivity, 
that are vital for effective learning. It does not have the 


animation feature that is®™™usenul@ior™ illwstration of 


an 


Сащ Е засада ща concepts Or complex processes. Without 
interactivity, we cannot get the users to actively 


participate in the course, and also to give feedback. 


B. SLIDE SHOWS 
Slide shows are simple and easy to produce. The same 
Microsoft Powerpoint slides that an instructor uses for 
his/her traditional classroom lectures can be easily 
imported into a website for use as a WBT course. Minimal 
development effort is required in this case. 
| A sample of a WBT course that is of the slide show form 
is shown in Figure 2 below. Similar to the lecture materials 
published on Web pages described earlier, the slide shows 


lack animation and interactivity. 
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We can again construct the equation for F MER КА 
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This gives a circuit diagram of 


Exercise : Inputs A, B and C represent the first, second and third bit ofa three digit binary number NV. N is represented by the 
function F such that 
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Construct the truth table and the corresponding circutt. | 


Next: Karnaugh Maps Up: Digital Logic and Microprocessor Previous: Logic Circuits 
E] Done | | =... | Te 


ЕХ е 5 А - « .. Е E IP = 





Figure 2. Slide Show 


C. WBT COURSE DEVELOPED USING A HIGH LEVEL LANGUAGE 

In the past, high level languages such as Java, Visual 
Baste Менн ере мете осеб by manyecemcevelop Compucer -bas-@ 
Training (CBT) courses. Today, a small number of developers 
are still using these high level languages to Pr dues WBT 
courses. 

The main advantage of using high level languages is 
that they are highly flexible and they allow full 
customizatıon to meet practically all the requirements of an 


eifective WBT course. 
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However, the main disadvantage is its high development 
cost in terms of time and money. Many  subroutines, 


functions, libraries; ete m mùůst ber created fron Sserateh to 


support specific requirements, such as user interface, 
screen navigations, search feature, animation and 
interactivity. 


The other disadvantage is its poor maintainability. The 
program codes are inherently long, and, more often than not, 
developers fail to document them adequately. Hence, 
modifications and upgrades become both time-consuming and 
tedious. 

Nowadays, application-specific software tools have been 
made available to help developers produce WBT courses. They 
are simple to learn and easy to use. They are discussed in 


mie next two sections. 


D. WBT COURSE DEVELOPED USING A PROPRIETARY SOFTWARE 
PACKAGE 


Proprietary software tools tailored for WBT course 
production are becoming increasingly popular with 
organizations transiting into distributed learning. The main 
attraction to these tools is the short learning curve. 

However, many of these tools are created by small 
software companies that lack the experience and 


comprehensive customer support of the more established 


т 


companies. As compared to COTS authoring tools to be 
discussed in the next section, these proprietary tools are 


usually more expensive (US$5,000 to US$30,000). Often, they 


do not have as many features and flexibility. 


A sample WBT course developed using a proprietary 


software tool is shown Figure 3 below. 
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Figure 3. WBT Course Developed Using A Proprietary Software 
Tools (http://blackboard.com/courses/CIT185LW/) 


E. WBT COURSE DEVELOPED USING  COMMERCIAL-OFF-THE- 
SHELF (COTS) INTERACTIVE SOFTWARE TOOLS 


There are several COTS interactive software tools for 


WBT course development available in the market today. Some 


= 
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have been used since the development of CBT courses started, 
and have since improved, upgraded and packed with more 
advanced features to produce powerful CBT and WBT courses. 
The main advantages of using these COTS tools include 
shorter learning curve, ease ОЕ use, excellent 


maintainability and upgradeability. 


F. RECOMMENDED TECHNOLOGY FOR USE 

Summarized in Table 1 below are all the technologies 
discussed above that are available for WBT course production 
compared against the preferred characteristics mentioned 


earlier in the chapter. 
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Table 1. Comparison Of Technologies Available 
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From Table 1, it can be seen that using COTS authoring 
tools was the most appropriate option for developing the 


EC2820 - Digital Logic Design On-Line Course. 


G. SELECTION OF SOFTWARE TOOLS FOR THE EC2820 ON-LINE 
COURSE 


In selecting the appropriate COTS software tools to 
use, previous research work done under the thesis project 
"Interactive Multimedia for Classroom and Web Use" by DSL 
Harvey were taken into considerations. [Ref.15] 

The main software tool selected by the author for 
creating the interactive on-line course was the Macromedia 
Authorware 5, with the support of a few other software tools 
to perform the other functions of a WBT course development 


as well-as the website creation discussed below. These other 
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tools -included graphic editors, text. editor, website 


creation and management tools. 


TE Interactive WBT Course Development Tool 

Through further research and experimentation, the 
selection for the main software tool for creating tHe 
interactive EC2820 On-Line course was narrowed to the three 
software tools namely Authorware 5, Director 7, and Flash 3, 
all of which were from Macromedia. 

A summary of the comparison of the three tools is 


given in Table 2 below. [Ref.12] 
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Table 2. Comparison Of Tools Available For WBT Course 
Development Tool 


There were also other similar tools available from 


other software companies such as Toolbook from Asymetrix 


rS 


which was the equivalent of Authorware 5, and Premiere from 
Adobe which was the equivalent of Director 7 and Flash 3. 

As shown in Table 2 above, Authorware 5 was optimized 
for interactive WBT course development and hence it was 
selected as the main software tool for developing the EC2820 
On-Line course. Although Darren Harvey used both Authorware 
Ели (ест main instructional content) and Director 7 иот 
animation and interaction) in his WBT course development, 
the author experimented extensively with Authorware 5 and 
realized that Authorware could perform the animation and 
Шширекасвоса functions of Director 7. in face the 
interaction features of Authorware were superior than that 
of Director. [Ref.15] 

Authorware was the leading visual rich-media authoring 
tool for creating Web and on-line learning applications. The 
1999 Computer-Based Training Report by SB Communications, 
publisher of CBT Solutions Magazine report, ranked 
Authorware as the Number One in the market every year since 
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Figure 4. Authorware Developer's Interface 
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The other key advantages of Authorware are discussed 


below: 


e Short Learning Curve. Developers of any skill level 
can quickly develop media-rich interactive learning 
applications with the Authorware flowline, icons, 
and templates. It took the author only three weeks 
to master the basic features of Authorware. A sample 
flowline is shown in Figure 5 below. 
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Figure 5. Authorware’s Easy To Use Flowline & Icons 
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Highly Interactive. Authorware maximizes learning 


with highly-interactive features including 
hyperlinking, hypertext, full text search and 
retrieval, and eleven different built-in 


interactions. It makes it easy to handle a wide 
variety of media and precisely track and respond to 
users' actions. 
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Figure 6. Authorware's Eleven Built-In Interactions 


Ease of Maintenance and Upgrade. Authorware 
represents program flow in graphical form, and it 
requires little programming for added flexibility. 
Hence, its program is simple to read and analyze, 
making it easy to maintain and upgrade. 


Distribution Flexibility. With Authorware, one can 
create learning applications, and deliver them to 
users on the Web, LANs, or in an executable format 
on CD-ROMS ог DWDSRUMS. 


PN 


e Fast Web Download. Authorware uses advanced 
compression and streaming techniques for fast 
downloading of its applications on the Web. 


D. Graphics Editors 

As authorware's built-in graphics editing function had 
limited capability, external graphics editors were used to 
performing the intricate functions of scaling, rotation, 
flipping, zooming, cropping, cutting, pasting and other 
Manipulations of graphics. There were many good graphics 
editors іп the market such аз Coreldraw, Photoshop, 
Freehand. 

Due to unavailability of any of these graphics editors, 
and also the lack of time to master them, the Microsoft 
Powerpoint was used to create all the graphics required for 
the on-line course, and then they imported into Paint Shop 
Pro, a shareware graphics editor from http://www.jasc.com, 
to compress them into GIF format before inserting them into 
Authorware. In fact, any available graphics editor would be 
able to perform the GIF compression function. 

Microsoft Powerpoint was used due to its simplicity and 
user-friendliness. The other reason was the availability of 
the "multiple undo" feature provided by Powerpoint that was 
not found in many graphics editors. This feature helped 
tremendously. 
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3. Text Editor 

The majority of the text used in the on-line course was 
typed using Microsoft Word instead of the Authorware built- 
in text editor. The reasons were that the built-in text 
editor lacked the excellent text formatting, styling, 
coloring, spelling check and auto-correct features of 


Microsoft Word. 


4. Website Creation And Management Tools 

The website creation and management tools provided the 
many functions needed to plan, create, test, maintain and 
manage the EC2820 Homepage. Besides presenting the EC2820 
course information such as the course objectives, outline, 
textbook, laboratory information etc., the homepage also 
served as the platform from which the EC2820 On-Line Course 
was launched on the Web and accessed by users. 

The Macromedia Dreamweaver  (US$300) and Microsoft 
FrontPage 2000 (US$70) were the two website creation and 
management tools evaluated as they were the two most 
popularly used recently. 

Dreamweaver had more advanced features than the 
Frontpage 2000. However, in terms of ease of use and user- 
friendliness, FrontPage 2000, with its look and feel 
designed very much like the rest of the Microsoft Office 


2000 packages, was significantly better. 
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Figure 7. Frontpage 2000 


The major weakness of FrontPage 2000 was its lack of 
compatibility with most web servers. The interactive 
features offered by FrontPage 2000 such as forms, search, 
confirmation field etc., could not work on most popular web 
servers, including the NPS server that was hosting the 
EC2820 Homepage. In order to make these features work, these 
servers, hosting web sites created using FrontPage, must 
install the FrontPage Server Extensions, a proprietary 
software of Microsoft to support FrontPage interactive 


components on the web. 
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Dreamweaver, on the other hand, was compatible with 
most web servers, and it used cgi scripts to handle the 
interactive features available, instead of а server 
extension. 

As the EC2820 Homepage did not require any interactive 
features, and also to cut down on development time, 
Frontpage 2000 was used to create the EC2820 Homepage. 
Nevertheless, the homepage could be modified using 
Dreamweaver to incorporate interactive features 


subsequently, if needed. 
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IV. THE DESIGN AND DEVELOPMENT PROCESS 
The process adopted for the design and development of 
the EC2820 On-Line course was similar to that used for 
conventional software development, with the exception of a 


training phase included at the beginning as shown in Figure 


e in 


Figure 8. The Design And Development Process 


8. 


A. TRAINING PHASE 

The training phase was required to allow the author to 
self-acquire the knowledge and skills of various multimedia 
tools necessary to produce significant web applications for 
on-line courses. Four Web development and multimedia tools 
namely Director 7, Authorware 5 Attain, Frontpage 2000 and 
Dreamweaver 2 were covered over a period of eleven weeks 
(with normal school lessons ongoing at the same time), as 
shown in the schedule below. A discussion of the software 


has been given in Chapter III. 
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Table 3. Training Schedule 












B. ANALYSIS 

In this phase, the objectives and requirements of 
creating the EC2820 On-Line Course were understood and 
translated into an implementation plan. Essentially, two 
end-products were required; the EC2820 Homepage and the 
EC2820 On-Line Course. An evaluation of the above mentioned 
Web development and multimedia software tools were done, and 
it was decided that the Microsoft FrontPage 2000 and the 
Macromedia Authorware 5 should be used to develop the 
homepage and the on-line course, respectively, based on 
their suitability, ease of use and maintainability as 
discussed in Chapter III. 

With these requirements in mind and having experimented 
with the software tools, tasks needed to complete the 
project were determined. The time and effort required of 
each task were assessed, and time was allocated to each task 
to ensure that they were achievable in the time available as 


shown in the Table 4 below. 
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es DESIGN 

T. EC2820 Homepage Design 

With the knowledge of FrontPage 2000 and also some 
guidelines on the "do's and don'ts" of website design 
[Ref.13 & 14], the layout of the EC2820 Homepage was first 
designed. 


The following design considerations were used: 


e It must be easy to navigate. Therefore, intuitive 
navigation menus were prominently displayed at the 
top and left hand side of each page. 


e Each page must allow access to all of the other Web 
pages throughout the website. The same set of 
navigation menus were placed at the same location on 
each page for easy access by users. 


e The design throughout the Web site needs to be 
consistent. Therefore, the layout of every page was 
made the same with buttons, background picture, 
banners, colors standardized. 
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Links to other relevant sites must be provided. 
Links to further information on the textbook, the 
creator of the homepage, the professor-in-charge, 
NPS, disclaimer, and link to Authorware plug-in were 
incorporated in the appropriate pages. 


The pages need to be pleasing to the eye. Several 
layouts, fonts style, codo combinations and 
background picture were  experimented to give a 
pleasant look and feel. 


The final design used for the EC2820 Homepage can be 


Seen in Figure 9. 
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Figure 9. Final Layout Design Used For The EC2820 Homepage 
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2. EC2820 On-Line Course Design 

Unlike the design of the homepage, the design of the 
ЕС В On-Line Course required more thought and 
experimentation due to the much larger amount of information 
that must be handled, more complex navigation, a smaller 
screen area (640 x 480 resolution to cater to all user 
Screen size), and multiple user accessible functions. 

There were about three hundred pages of lecture 
materials and quizzes to be delivered in the on-line course. 
In order to make them easily accessible, they were organized 
into eleven sections of between twenty to fifty pages each, 
by grouping of relevant topics together. Quizzes were added 
to the end of each section to help users review the 


section's material. 
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Figure 10. Organization Of Sections And Pages Of The On-Line 
Course In Authorware 


The screen layout used for the EC2820 On-Line Course as 


seen by the user is shown in Figure 11. 
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3-13 Universality of NAND Gate 


We have seen that the Inverter and AND functions can be realized using 
only NAND gates. We can also realize the OR function using only NAND 
gates. Fig 3-18 shows the implementation. 
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Fig 3-18 NAND gates can be used to implement Inverter, OR and AND functions 
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Figure 11. Final Layout Design Used For The EC2820 On-Line 
Course 





Similar to the design of the homepage, a set of 
guidelines were defined and used in the design of the layout 


as described below: 


e Look-and-Feel. To achieve a "clean" look, much space 
was placed between blocks of information. To achieve 
ehr, several layouts, fonts style, colos 
combinations and background picture were tried. 


e Ease of navigation. The navigation buttons were made 
user-friendly and were always located in the same 
position at the bottom of each page. All buttons 
were made to respond by changing their look or color 
when they were clicked or moved over. 
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e Access to all other pages. Using the navigation 
buttons, a user was given the flexibility to move to 
the first page, last page, from page to page, first 
section, last сессіои сеспей Ес -есЕ оп, search 
for keyword(s), search for a page, and go back to 
recently visited pages. The user could also choose 
to navigate using a pull-down menu. 


e Maximum screen size. At the point when the on-line 
course was designed, the biggest display that could 
fit all computer screens is the 640 pixels by 480 
pixels resolution (known as VGA mode). 


e High level of interactivity. The interactions 
introduced in the on-line course took the form of 
user-controlled animations, simple true-false 
questions, multiple choices questions, fill in the 
blank exercises, numeric data entry for mathematical 
problems, and Drag-drop exercises. 


A user-controlled animation is shown in Figure 12. 
Animations were used to demonstrate the step-by-step method 
of deriving the reflected Gray code from the given binary 
code. The user is allowed to view the animations at his/her 


own pace, and repeat the entire process any number of times. 
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2-6. Gray Code (2) 


Decimal Binary Code Gray Code Reflection axis for 
the rightmost bit of 
the first two Gray 
codes 


special type, called the “reflected 
Gray code. This is so because the 
code can be derived by using the 
reflection of certain bits of the 
code as illustrated by the table on 





Figure 12. A User-Controlled Animation 


A true-false question, a multiple-choice question, and 
a fill-in-the-blank question are shown in Figure 13, Figure 
14 and Figure 15 respectively. The user could participate by 
selecting an answer for the true-false and multiple-choice 
question or key in an answer in the case of the fill-in-the- 
blank question, and then check the correct answer by 
clicking the "Check Answer" button. If uncertain, he/she 


could click the "Check Answer" button directly. 
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4.12. Review Question (2) 


Question 


Totem pole outputs (In which there are two transistors; one 
connecting the output to high and one connecting the output to 
low) should not, in general, be connected together, whereas 
open collector (in which there is one transistor connecting the 
output to low) are intended to be connected together. 


c True 


Check Answer | 


C False 





Figure 13. A True-False Question 


3.15 Review Ouestion (22) 
Question 


What function does the following circuit realize? 


c AND function 
C Exclusive OR function 
C ORfunction 


C Exclusive NOR function 


Check Answer 
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Figure 14. A Multiple-Choice Question 





EN 


2-13. Review Ouestion (6) 
Question 


What is the standard binary number equivalent to the 
hexadecimal number D3AF«? 


Type Your Answer & Press Enter › | 


Check Answer | 


Current Section: 2. Number Systems ^ 


Page 





Figure 15. A Fill-In-The-Blank Question 


A drag-and-drop question is shown in Figure 16. The 
user could participate by dragging possible answers, and 
dropping them into the appropriate blanks, in this case, and 
then check the correct answer by clicking the "Check Answer" 


button. Also, he/she could check the answer directly. 


2-13. Review Ouestion (7) 


Complete the table below by dragging and dropping a selection into 
each blank entry, showing for each blank entry an 8-bit number that is 
the 8-bit two's complement of the number in the top row. 


A in decimal — 
A in 8-bit 2's 
complement — 
-A in 8-bit 2's 
complement — - 


Selections for Drag & Drop 
10001101 1000 0000 00000001 01111111 1000 0001 


1111 0011 11111111 00001101 *Outofrange ‘Out of range 


Check Answe г | 
и 


Fert еі ка 
еі 


к 





Е Figure 16. A Drag-And-Drop Question 
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D. DEVELOPMENT AND TESTING 

The development and testing phase was the most task- 
intensive of all the phases. First, the EC2820 Homepage was 
constructed, uploaded to the Web server, and tested. Once 
the homepage was successfully completed, the EC2820 On-Line 


Course was developed to run from the homepage. 


1. Development And Testing Of The EC2820 Homepage 

The development of the EC2820 Homepage was done without 
much difficulty using the Microsoft FrontPage 2000. 
Frontpage’s complete suite of built-in functions such as 
text editor, graphics editor, website manager, navigation 
tools, ftp application etc. allowed very rapid development 


and testing. 


24 Development And Testing Of The EC2820 On-Line 
Course 


As for the development of the EC2820 On-Line course, 
due to its huge size, a popular approach used to design and 
develop huge software projects known as the incremental 
development approach was used. 

Using the approach, the on-line course project was 
developed on small incremental steps. It was started with a 
bare-bone piece and gradually built up by adding more and 


more content. АС each step, additional material was 
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designed, added and tested before moving on to the next 
step. 

Using this approach, the storyboard of each section, 
which consisted of between twenty to fifty pages, was first 
drafted. It was then translated into a digital format, which 
was made up of text, graphics and animations, suitable for 
presentation in Authorware. This step was performed with the 
help of Microsoft Powerpoint and Paint Shop Pro for graphics 
creation and editing, and Microsoft Word for text editing. 
Animations and interactions were performed within 
Authorware. 

As more pages were built, 2 types of tests were 
conducted. The first was called a page test and was 
conducted very frequently. This was conducted within the 
Authorware development environment each time a group of two 
to five pages was completed in Authorware. The page test was 
carried out to check for layout, bugs, alignment problem, 
animation synchronization problem, overlapping of 
text/graphics,  page-to-page navigation and other errors 
specific to the pages. Remedy actions, if required, were 
taken and the tests were repeated. 

The second was called a section test. This test was 
conducted upon the completion of a section. It required the 
entire project to be first compiled into a format suitable 


for publishing on the Web. The test was then carried on the 
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Web-published version of the Project to check Eor 
problems/errors with uploading/downloading of the project to 
and from the web server, compatibility problems with the web 
browser, navigation when browsing from section to section, 
page to page using the navigation buttons as well as the 
menu, keyword(s) and page search, list of recently pages and 
so forth. Concurrently, the page test was also performed. 
Again, remedy actions were taken when required and the test 
was repeated. The steps used in incremental development 


approach are summarized in Figure 17 below. 
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Ready for 
Section Test? 


Yes 


Publish On-Line 


Section Test 


Yes 






No 







Project 
Completed? 


Yes 
=. 


Figure 17. Steps in the incremental development approach 


Although the incremental development approach was very 


tedious, it allowed the author to focus attention on a small 


group of tasks at a time at each step, and this reduced the 
chance of introducing errors into the project, and also 
helped to detect errors early and confine the extent of 
error propagation. 

Table 5 below gives a breakdown of timings that the 


author took for coding each type of multimedia component. 


hours 
E | FU il 
hour 


МІ Typing ОЕ text per page 10 тіп Es 30 
4. Coding of an animation i | o S 
hours 





Table 5. Breakdown Of Timings For Coding 


The graphics drawn could be categorized into 3 types; 
simple, detailed and complex as shown in figure 18 to 20. On 
the average a simple graphic would take 15 minutes to 1 hour 
to produce, a detailed graphic 1 to 1.5 hours, and a complex 


graphic 2 to 3 hours. 
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Figure 18. Simple Graphic - 15 Min To 1 Hour To Produce 
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Figure 19. A Detailed Graphic - 1 To 1.5 Hours To Produce 
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Figure 20. A Complex Graphic - 2 To 3 Hours To Produce 


A total of about two hundred graphics was created for 
the on-line course; 25 percent were simple graphics, 60 
percent were detailed ones, and the remaining 15 percent 
were complex ones. It is apparent that much time and effort 
has to be invested in the creation of graphics for on-line 
course development. Having a graphic artist as part of the 
development team would certainly help speed up the 


development work tremendously. 


E. IMPLEMENTATION 
In the implementation phase, the EC2820 Homepage and 


the EC2820 On-Line Course were successfully completed and 
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tested, and were officially published in March 2000 on the 
ECE Department's Web server that was catered for distributed 
learning. 

Evaluation was conducted to gather feedback and 
suggestions while this prototype on-line course was in use. 

Besides using the completed Authorware project for the 
on-line course, it could be used as an effective tool for 
classroom teaching, and also it could be burned into a CD- 
ROM for distribution to students on a distributed learning 


program. 
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V. CONCLUSIONS AND RECOMMENDATIONS 


A. CONCLUSIONS 

This thesis project has been an extended learning 
process about the World Wide Web and its associated 
technologies. The author has gained a substantial amount of 
knowledge and technical skills from completing this thesis 
project in many areas of Web technology including Web 
publishing, Web animations, Web based learning, and Web 
administration. 

The EC2820 Homepage and On-Line Course, that were 
created, offered many facilities to the user which provided 
a flexible and interesting learning environment. Anyone in 
the world with a computer and an internet connection could 
access the information, thus increasing the target audience. 

The homepage which, when compared to many other sites, 
was very well presented and easy to use. The on-line course 
allowed significant user interaction, and thus was an 
effective learning tool. However, both products were by no 
means finished and like all Web pages, they needed to be 
continually updated to provide the user with better 
information and features. There were two features, sound and 
video, that the author felt could have been added to make 


the on-line course more effective and complete. 
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Days cnecrsprousctohas Sought the following answers 


to the research questions posted in Chapter I. 


I. Which Recent Web Technology Is Tbe Most Suitable, 
And Also Cost/Time-Effective For The Production Of 
WBT ECE Courses? 


Several recent technologies were investigated and their 


pros and cons were examined. These technologies included: 
e Publishing lecture materials directly on web pages. 


e Publishing lecture materials in the form of slide 
shows that run on the web browser. 


e Developing WBT course using a high level language 
such as Java, Visual Basic etc.. 


e Developing WBT course using a proprietary software 
package. 


e Developing WBT course using commercial-off-the-shelf 
(COTS) authoring tools such as the Macromedia 
Authorware 5. 


In consideration of its moderately short development 
time, good maintainability and upgradeability, excellent 
ability to add interactivity and animation to the WBT 
course, and also its cost effectiveness, the use of COTS 
authoring tools was found to be the most suitable technology 
for future development of ECE WBT courses. In particular, 
the use of the Microsoft Frontpage 2000 and the Macromedia 
Authorware 5 were highly recommended for use in creating 


course homepages and WBT courses respectively due to their 
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short learning curve and the many powerful features that 


came with the software. 


2% What Is The Recommended Approach, Design And 
Development Process That Should Be Adopted For 
Future Productions? 


The incremental development approach was used for the 
thesis project development. It was popular for developing 
huge software projects, and in fact, the author had a prior 
opportunity to use it for his projects in a Java programming 
class. 

The approach called for small incremental steps in the 
development. The project was started with а minimal 
functionality and gradually built up step-by-step. At each 
step, additional content was designed, added and tested 
before moving on to the next step. 

It is without doubt that this methodical approach had 
led to the successful completion of the thesis project. The 
breakdown of the development work into steps and detailed 


tasks required at each step had been discussed in Chapter V. 


3. What Are The Trainings Required For Such 
Production? 


To successfully produce a effective WBT course, the 
following knowledge, skills and resources must be made 


available: 
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Knowledge of course content. Usually the instructor 
has to get involved in advising what materials to 
include in the WBT course. It would be of great help 
to the quality of the development if the developer 
also has a good knowledge of the course content. 


Multimedia software. Multimedia software can be used 
to produce WBT courses that are effective learning 
tools. It is imperative that the developer receives 
formal training on the required software to attain a 
high level of proficiency so that he can bring out 
the best in these software in the shortest time 
possible. 


Teaching skills and WBT exposure. It would help a 
great deal if the developer has some previous 
traditional teaching experience as that would equip 
him with the skills of deciding the manner 
information is organized and presented for effective 
learning. As there is a great difference between 
traditional teaching and WBT, that is, the absence 
of instructor-student face-to-face interaction in 
WBT, the developer should be exposed to WBT 
environment to learn more about its constraints and 
its strong points such as the animation capability 
that can be used to illustrate difficult concepts, 
and the interaction capability that can be used to 
engage the active involvement of the student. With 
this knowledge, he can target the content to be 
presented in different ways, meeting the needs of 
different learning styles 


Graphic design. It is inevitable that the developer 
have graphics design and editing skills. They are 
required to transform figures, tables, and photos in 
its raw form into compressed computer format or to 
produce any animation required. 


RECOMMENDATIONS 


E; 


Formalize Training 


Developers must be well trained in the required 


multimedia software tools in order to produce effective WBT 
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courses using the least time and cost. The training approach 
used by the author, in which he self-learned all the 
required software tools, was time-consuming and tedious. The 
time taken could be easily halved using formal training 
methods, hence allowing more time to be channeled into more 
productive development work. 

There are two recommended methods of providing formal 
training to the developers. One method is to send them for 
short commercial courses that are application specific. The 
other method is to incorporate the required training into 
some of the relevant courses currently conducted in NPS. 
Potentially, there are three Computer Science (CS) courses 
that could introduce multimedia software training namely 
CS3202 - Introduction To Multimedia Production (learning 
Macromedia Director is part of the course syllabus), CS3203 
- Advanced Multimedia Production (good candidate for 
Macromedia Authorware training) and CS3505 - The Internet 
And The Information Highway (good candidate for Frontpage 
2000 or Macromedia Dreamweaver training). 

The commercial course method is more suitable if the 
number of developers to be trained is small, and also if the 
training required is immediate or when the schedule of the 
internal NPS courses could not fit in the project schedule. 

Since many NPS departments are interested in 
distributed learning and some departments have already 


initiated various projects in that area, there will be many 
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faculty members and developers who will require training in 
multimedia software tools. This being the case, the 
incorporation of the training into some of the NPS courses 


is a more cost-effective option. 


22 Introduce Instructional Management Systems (IMS) 

With Instructional Management Systems (IMS), the 
administrator of the WBT course can efficiently plan, 
produce, administer, and deliver curricula, as well as 
track, store, and report student progress from anywhere in 
the world, for any number of students at multiple locations. 

Using IMS, students have to login using ID and 
password, which enables the IMS to automatically track their 
individual actions. An IMS database will hold names, 
locations, and other student and course information. The IMS 
can manage course administration and planning, student 
registration and enrollment, and the assignment of specific 
training courses to subsets of the student population. It 
also provides automatic tracking and statistics of student 
progress and test scores. Limited IMS is supported by the 
current version of Macromedia Authorware. For more complete 
IMS functions, the Macromedia Pathware 4, which is fully 


compatible with Authorware, is recommended. 
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3. Standards: Provide A Platform For Interoperability 

In line with the recommended introduction of IMS, 
standards for developers to provide the requisite level of 
interoperability have to be established when efforts in the 
area of distributed learning are still evolving, with work 
coming from different interest groups. 

Standards improve the return on investment by 
providing a framework for interoperability. Interoperability 
holds the key to the reuse and integration needed for 
tomorrow's sophisticated distributed learning. Also, by 
providing a set of standards identifying specific trackable 
information, developers can build WBT courses which can link 
to a common management system. This will allow the school to 
better manage and track instruction. 

The benefits of having a standards-based integrated 


teaching and learning system are vast, including: 


e Providing immediate feedback so that students and 
instructors can take action as needed. 


e Providing a comprehensive library of training 
materials in one repository. 


e Sharing of content and resources. 


e Providing reports to allow for better measurements 
of usage and results. 


e Minimizing costs associated with the implementation 
of multiple systens. 


e Support for a wide selection of authoring tools. 
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4. Explore Video And Real-Time Interaction 

The use of video and real-time interaction is being 
facilitated by higher bandwidth, decreasing cost and 
availability of new Web technologies. 

Lectures can be recorded, digitized and broadcasted 
live over the Web at specific times, and students using a 
computer and a internet connection, can attend the lecture 
at the comfort of their home and interact real-time with the 
lecturer. 

Alternatively, lectures can be pre-recorded, digitized, 
and broadcasted at scheduled times over the Web and students 


can watch them and send questions via email to the lecturer. 


5. Use Author's Project As Template 

It was felt that this report would give any future 
student who would be interested in developing similar 
project a good understanding of what is achievable and how 
to achieve it. 

The incremental development approach used by the author 
has been a key factor in the successful ЕВЕ of the 
project and is strongly recommended for future development. 

The reuse of some of the Authorware codes for the 
EC2820 On-Line Course such as the code for the section-to- 


section and page-to-page navigation, true-false, multiple 
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choice questions,  drag-drop exercises, animations etc., 
would certainly help reduce the overall development time. 

It is hoped that the homepage and on-line course 
provide people with many hours of enjoyment and that it will 


be further improved by future students as emerging 


technologies permit. 
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APPENDIX A. USING MULTIMEDIA FOR DISTRIBUTED LEARNING 


A. WHAT IS MULTIMEDIA? 
A commonly used definition of "multimedia" is: 
Digital multimedia is the field concerned with the 
computer-controlled integration of text, graphics, 
still and moving images, animation, sounds, and 
any other medium where every type of information 


can be represented, stored, transmitted, and 
processed digitally. [Ref. 1] 


B. WHY MULTIMEDIA? 

Over the past few years, multimedia has proven itself 
to be one of the most effective tools in education. 
Multimedia uses a combination of the text, graphics, 
animation, sounds, video etc. to create a dynamic, visual 
presentation that catches the users’ attention and maintains 
their interest throughout the presentation significantly 
reducing the time needed to comprehend material. 

In essence, multimedia can play a key role in improving 


mae delivery of instructional content by: [Ref.19/ 


e Presenting media in visual, graphical way using 
animation, video and other forms of multimedia. 


e Using audio to expand sensory input. 
e Creating “learning by doing” exercises. 


e Offering learners the ability to control the pace 
and flow in a non-threatening, patient manner. 


SH 


e Providing a framework for collaboration for students 
and instructors. 


e Managing the learning environment. 


e Offering instruction any place, any time. 


C: METHOD OF INSTRUCTION VS MULTIMEDIA 

The success of a WBT course as a good learning 
environment depends on the method of instruction as in the 
traditional training situation. Only through proper teaching 
methods can we captivate, motivate, and excite our users to 
be actively involved in the learning process. The choice of 
multimedia is secondary. [Ref. 2] 

Therefore, it is of paramount importance that the 
instructor, that teaches the course in traditional method, 
authors the WBT course or plays a major role in designing 
the WBT course. 

In order to be as effective as in a traditional 
training situation, the WBT course should make good use of 
multimedia to focus on demonstrating, animating and 
explaining a topic, giving the users ample opportunity to 
practice, and paying particular attention to feedback and 


response. 
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De IMPORTANCE OF INTERACTIVITY 

Interactivity is one of the main attractions of 
using multimedia. It helps increase the users active 
participation in processing the course material. In general, 
a more active user will understand and retain knowledge more 
readily than a passive user. 

The strategies to ensure that users participate 
actively include requiring them to answer different types of 
question (true & false, multiple choice, fill in the blanks, 
and mix & match), step through animations, navigate through 
screens, and decide the topic to learn. 

A study by J.D Fletcher for the Institute for Defense 
Analysis found that interactive applications improve 
achievement by up to 25 percent over conventional training. 
Similar studies at university level have shown proficiency 
increments of up to 40 percent while cutting instruction 


time by half. [Ref. 2] 
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